来月末でぷららブログが閉鎖するため、現在、特急で引っ越し作業中…の前段階のWordPress勉強中のSiSOです。Gushという、シンプルでカスタマイズしやすいという無料テーマをインストールし、あれこれカスタマイズ中ですが、XAMPP上で動作しているWordPressの表示状態を、別のパソコンやスマホで確認できるようにしてみました。

自宅で無線LAN使っているなら簡単

これまで、ローカル環境（XAMPP上）で動作しているWordPressの表示確認をするのに、動作しているパソコン上でWEBブラウザを起動し、URLは「localhost」（ネットワークで自分自身を表すデフォルトの名称）としていました。

しかし、この「localhost」は、読んで字のごとく、ローカルなホストな訳でして、これを使っている限り他のパソコンやスマホからアクセスすることはできません。

各ご家庭の環境によると思いますが、我が家ではインターネットを引き込んだ後、無線LAN親機にて各種デバイスを接続しています。我が家の周りでも多くの無線LAN親局が見つかるので、このスタイルで運用されている方は多いのではないでしょうか？

このような用途のための無線LAN親機には、DHCPという、ローカルなIPアドレスを各子機に割り当てる機能があります。IPアドレスというのは、各パソコンやスマホに割り当てられるネットワークの番号です。

同一の無線LAN親機の下であれば、他のパソコンにアクセスすることも可能なので、IPアドレスを調べて接続する、という方法でWordPressが動作しているパソコンにアクセスします。

まずはIPアドレスを調べてみよう

ということで、最初に、XAMPPとWordPressを実行しているパソコンのIPアドレスを調べます。Windows7の場合ですが、「Windowsキー」を押してメニューを表示し、「すべてのプラグラム」→「アクセサリ」と進み、「コマンドプロンプト」を起動します。

続いて、「ipconfig」というコマンドを実行します。

スクリーンショットでは切れてしまいましたが（すいません）、Windowパソコンのネットワーク構成が表示されますので、その中からIPアドレスを探します。我が家の場合は「IPv4 アドレス」という行が該当しました。

WordPressアドレスとサイトアドレスを設定

続いて、先の操作で得たIPアドレスをWordPressに設定します。WordPressの管理画面から「設定」をクリックし、一般設定の中にある、「WordPressアドレス(URL」と「サイトアドレス(URL)」の項目を設定します。XAMPPで今まで動作させていたのであれば、恐らく、「localhost」と書いてあると思いますが、これを変更します。

 設定が終わったら保存してください。

Windows ファイアウォールの設定

Windowsにはファイアウォールという、セキュリティのためにネットワークアクセスを制限する機能があります。XAMPPには、Apacheという超有名どころのWEBサーバープログラムが入っています。このプログラムがWEBブラウザとWordPressとのデータのやりとりを行っています。

今回、ネットワーク上の他のパソコンから接続できるようにするため、Apacheがファイアウォールを通れるように設定する必要があります。

まずは、「コントロールパネル」から「Windows ファイアウォール」を選択します。「Windows ファイアウォール」の設定画面が開いたら、左上にある「Windows ファイアウォールを介したプログラムまたは機能を許可する」をクリックします。

 「許可されたプログラム」というウィンドウが開きますので、ここで「Apache」を許可します。そのためには「設定の変更」をクリックしてから行う必要があります。

 しかし、改めて見ると、Windowsのネットワーク関係、適当に設定しているのがバレバレですね…。ちゃんと、「ホーム/社内（プライベート）」を設定していれば、そのままアクセスできそうです。

気を取り直して「Apache HTTPServer」のチェックをオンにします。

WordPressの記事をちょっと手直し

実は、これで他のパソコンから、まるでどこかのブログサイトへアクセスするように表示できるようになるのですが、記事内の画像がちゃんと表示されません。WordPressの記事投稿画面にて「テキスト」表示させるとわかりますが、画像ファイルへのリンクが「localhost」のままになっています。これをIPアドレスに修正する必要があります。

サムネイル画像など、WordPressのプログラムによって都度、URLが生成されているものは大丈夫です。

他のパソコンやiPhoneで表示確認

ということで、家庭内ネットワークの他のパソコンからアクセスしてみました。バッチリ表示されています。

あとはiPhoneでも確認してみました。左のスクリーンショットがSafari、右のスクリーンショットはDolphinです。Dolphinは、当ブログでも何度か紹介していますが、パソコン表示モードも使えてなかなかいいブラウザです。

 あ、Nexus7でもスクリーンショットを撮ればよかった…。でもこれで、パソコン、タブレット、スマホで動作確認できる環境がそろいました。

ドルフィンブラウザ 7.5（無料）
カテゴリ: 仕事効率化, ユーティリティ
販売元: MoboTap Inc. – MOBOTAP INC.（サイズ: 18.3 MB）
全てのバージョンの評価: （4,422件の評価）

※アプリ価格は掲載時のものです。

今日の一言二言三言

最初から　WordPressに IPを
設定しておきゃ　よかったな、ああ。

最初からこうしておけば、ローカル環境で作成した記事の画像もすぐに見れたわけで、ちょっと後悔です。ちなみに、DHCPの「D」は、ダイナミックという意味ですが、普段からよく使っているデバイスであれば、だいたいいつも同じIPアドレスが割り当てられますので、都度、IPアドレスを変えるようなことはないと思います。

落描解説：Gushカスタマイズ用トップイラストです。使いまわしです。